.hd-wrap {
    height: .9rem;
    line-height: .9rem;
}
.hd-inner {
    padding: 0 1.4rem 0 1.1rem;
    border-bottom: 1px solid #ccc;
}
.hd-inner-blue {
    background-color: @mainTextColor;
    color: #fff;
    .hd-right {
        // border-left: 1px solid #00468C;
    }
}
.hd-back {
    .pa;
    left: .3rem;
    top: 0;
    min-width: .6rem;
    min-height: .9rem;
    padding-left: .2rem;
    &:before {
        .pa;
        top: .3rem;
        left: 0;
        .block;
        border: .07rem solid #000;
        border-right: none;
        border-bottom: none;
        content: " ";
        width: .25rem;
        height: .25rem;
        -webkit-transform: rotate(-45deg)
    }
}
.hd-back-in {
    .pa;
    left: 0;
    top: 0;
    width: .9rem;
    padding-left: 0;
    // border-right: 1px solid #00468C;
    &:before {
        left: .4rem;
        border-color: #fff;
    }
}
.hd-fx {
    .fx;
    width: 100%;
    max-width: @max-width;
    top: 0;
    z-index: 1;
}
.hd-main {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    word-break: break-all;
    text-align: center;
}
.hd-main-left {
    text-align: left;
}
.hd-right {
    .pa;
    right: 0;
    top: 0;
    width: 1.2rem;
}
.hd-search {
    .fr;
    width: .8rem;
    height: .4rem;
    line-height: .4rem;
    padding: .08rem .12rem;
    margin-top: .17rem;
    border-radius: .4rem;
    background-color: rgba(0, 0, 0, 0.3);
    i {
        display: inline-block;
        width: .34rem;
        height: .34rem;
        background: url(../../img/header-search.png) no-repeat;
        background-size: cover;
    }
}
//下拉箭頭
.hd-nav {
    .pr;
    .fr;
    padding-right: .3rem;
    &.black {
        color: #333;
    }
}
.hd-icon {
    .pa;
    right: 0;
    bottom: .12rem;
    .triangle(down, .1rem, #000);
    -webkit-transform: rotate(-45deg);
    &.at {
        right: .1rem;
        bottom: 0;
        .triangle(up, .1rem, #000);
        border-top: 0;
        -webkit-transform: rotate(0);
    }
    &.white {
        .triangle(down, .1rem, #fff);
    }
    &.white.at {
        .triangle(up, .1rem, #fff);
        border-top: 0;
    }
    &.at-login {
        right: .1rem;
        bottom: 0;
        .triangle(up, .1rem, #7bbadd);
        border-top: 0;
        -webkit-transform: rotate(0);
    }
}
//分享按鈕
.hd-icon-share {
    .pa;
    right: .25rem;
    top: .2rem;
    width: .5rem;
    height: .5rem;
    background: url(../../img/nav-share.png) no-repeat;
    background-size: cover;
}
//搜尋按鈕
.hd-icon-search {
    display: inline-block;
    width: .33rem;
    height: .33rem;
    margin-top: .19rem;
    margin-right: -.03rem;
    background: url(../../img/header-search.png) no-repeat;
    background-size: 100%;
}
.hd-icon-group {
    .fr;
}
.hd-icon-input {
    display: inline-block;
    border: none;
    padding-left: 0.1rem;
    height: .6rem;
    font-size: .3rem;
    line-height: .6rem;
    width: 4.8rem;
}
.hd-icon-order {
    position: absolute;
    right: .2rem;
    top: 0rem;
    font-size: .28rem;
    color: #fff;
    z-index: 1000;
}

